// components/custom-popup.ts

import tran from '../../utils/language'
import { commonTagList } from '../../utils/api.js'
Component({
  pageLifetimes: {
    show() {

    }
  },
  /**
   * 组件的属性列表
   */
  properties: {
    paramsData: {
      type: Array,
      defaultValue: [
        {
          selectFlag: false,
          text: 'INTP'
        },
        {
          selectFlag: false,
          text: 'INTJ'
        },
        {
          selectFlag: false,
          text: 'ENTJ'
        },
        {
          selectFlag: false,
          text: 'ENTP'
        },
        {
          selectFlag: false,
          text: 'ENFP'
        },
        {
          selectFlag: false,
          text: 'INFP'
        },
        {
          selectFlag: false,
          text: 'ENFJ'
        },
        {
          selectFlag: false,
          text: 'INFJ'
        },
        {
          selectFlag: false,
          text: 'ISTJ'
        },
        {
          selectFlag: false,
          text: 'ISFJ'
        },
        {
          selectFlag: false,
          text: 'ESTJ'
        },
        {
          selectFlag: false,
          text: 'ESFJ'
        },
        {
          selectFlag: false,
          text: 'ISTP'
        },
        {
          selectFlag: false,
          text: 'ISFP'
        },
        {
          selectFlag: false,
          text: 'ESTP'
        },
        {
          selectFlag: false,
          text: 'ESFP'
        }],
      value: [
        {
          selectFlag: false,
          text: '',
          tagTypeId: ''
        }
      ],
      observer(newVal) {
      }
    },
    pickerParams: {
      type: Object,
      value: {
        show: false,
        pickerType: 'gender',
        defaultValue: ''
      },
      observer(newVal) {
        if (newVal) {
          if (newVal.defaultValue) {
            setTimeout(() => {
              this.handleData(newVal)
            }, 500)
          }
          // this.data.visible = newVal.show
          // 在这里处理值变化逻辑
          if (newVal.show && newVal.pickerType === 'date') {
            // this.populatePicker();
          }
          // if (newVal.show && newVal.pickerType !== 'date') {
          //   this.setData({ pickerValue: [newVal.defaultValue] })
          // }
          // 兴趣
          // if (newVal.show && newVal.pickerType == "interest") {
          //   this.getInterest()
          // }
          // // 职业技能
          // if (newVal.show && newVal.pickerType == "professionId") {
          //   this.getProfession()
          // }
          this.setData({
            visible: newVal.show
          })
        }
      }
    },
    mbtiSwitch: {
      type: Boolean,
      value: false,
      observer( newVal ) {
        this.setData({
          switchChecked: newVal
        })
      }
    }
    // visible: {
    //   type: Boolean,
    //   value: false,
    //   observer(newVal) {
    //     console.log(newVal, 99)
    //     // 在这里处理值变化逻辑
    //     if (newVal) {
    //     }
    //   }
    // },

  },

  /**
   * 组件的初始数据
   */
  data: {
    _t: tran._t('filterPopup'),
    animation: null as any | null, // WechatMiniprogram.Animation
    pickerDatas: {
      gender: { title: '性别', data: ['全部', '男性', '女性', '其他'] },
      MBTI: { title: 'MBTI', data: ['INTP', 'INTJ', 'ENTJ', 'ENTP', 'ENFP', 'INFP', 'ENFJ', 'INFJ', 'ISTJ', 'ISFJ', 'ESTJ', 'ESFJ', 'ISTP', 'ISFP', 'ESTP', 'ESFP'] },
      language: { title: '选择语言', data: ['English', '简体中文', '繁体中文'] },
      date: { title: '选择日期' },
      interest: {
        title: '兴趣',
        data: []
      }
    },
    switchChecked: false,
  },

  /**
   * 组件的方法列表
   */
  methods: {
    handleData(obj: any) {
      const { paramsData } = this.data
      if (paramsData.length > 0) {
        paramsData.map(item => {
          // if (item.text == obj.defaultValue) {
          if (obj.defaultValue.indexOf(item.text) != -1) {
            item.selectFlag = true
          } else {
            item.selectFlag = false
          }
        })
      }
      this.setData({
        paramsData
      })
    },
    onSwitchChange() {
      this.setData({
        switchChecked: !this.data.switchChecked
      }, () => {
        this.triggerEvent('mbtiSwitchChange', this.data.switchChecked)
      })
    },
    /**
     * 重置
     */
    resetTap() {
      const { paramsData } = this.data
      paramsData.map((item: any) => {
        item.selectFlag = false
      })
      this.setData({
        paramsData,
        switchChecked: false
      })
    },
    tapMbti(e: any) {
      const { info } = e.currentTarget.dataset
      const { paramsData } = this.data
      // 判断用户点击的是哪一个按钮，从而将那一个按钮状态反选
      paramsData.map(item => {
        if (item.text === info.text) {
          item.selectFlag = !item.selectFlag
        }
      })
      let currentList = paramsData.filter(item => item.selectFlag == true)
      this.setData({
        paramsData: paramsData,
        switchChecked: currentList.length > 0 ? true : false // 当用户选择了一个后，就默认开启，否则关闭
      }, () => {
        this.triggerEvent('mbtiSwitchChange', this.data.switchChecked)
      })
    },
    characterConfirm() {
      const { paramsData } = this.data
      // 过滤出选中的几项
      const selectMbtiList = paramsData.filter(item => item.selectFlag)
      let ids: any = []
      let nameList: any = []
      selectMbtiList.length > 0 && selectMbtiList.map(item => {
        ids.push(item.tagTypeId)
        nameList.push(item.text)
      })
      // if (selectType == 'interest') { // 兴趣
      //   formData.interestIds = ids.length > 0 ? ids.join(',') : ''
      //   formData.interestName = nameList.length > 0 ? nameList.join(',') : ''
      // } else if (selectType == 'skill') { // 职业技能
      //   formData.professionId = ids.length > 0 ? ids.join(',') : ''
      //   formData.professionName = nameList.length > 0 ? nameList.join(',') : ''
      // } else { // mbti
      //   let textList: any = []
      //   selectMbtiList.length > 0 && selectMbtiList.map(item => {
      //     textList.push(item.text)
      //   })
      //   formData.personalities = textList.length > 0 ? textList.join(',') : ''
      // }
      // let textList: any = []
      // selectMbtiList.length > 0 && selectMbtiList.map(item => {
      //   textList.push(item.text)
      // })
      this.triggerEvent('confirmPicker', selectMbtiList)
      // formData.personalities = textList.length > 0 ? textList.join(',') : ''
      // this.setData({
      //   characterSelectFlag: false,
      //   currentMbtiList: selectMbtiList,
      //   formData
      // })
    },
    /**
     * 获取兴趣列表
     */
    getInterest() {
      const { pickerDatas } = this.data
      const { interest } = pickerDatas
      let params = {
        tagType: 'INTEREST'
      }
      commonTagList(params).then(res => {
        interest.data = res
      })
      this.setData({
        pickerDatas
      })
    },
    getProfession() {
      const { pickerDatas } = this.data
      const { interest } = pickerDatas
      let params = {
        tagType: 'INTEREST'
      }
      commonTagList(params).then(res => {
        interest.data = res
      })
      this.setData({
        pickerDatas
      })
    },
    closePopup() {
      this.triggerEvent('cancel', false);
      this.setData({ visible: false })
    },
    // onConfirm (e: any) {
    //   console.log(e);
    // }
  }
})